<template>
	<view>
		<!-- PS: 通用二维码解析的识别率是不如 weixin 的，但是识别率还是可以的，如果需要高识别率，请使用 weixin 扫码 -->
		<!-- 这是扫码用的 https://ext.dcloud.net.cn/plugin?id=7007-->
		<mumu-get-qrcode ref='getQrcode' @callback='qrcodeCallback' @success='qrcodeSucess'
			@error="qrcodeError"></mumu-get-qrcode>
		<!-- 这是从相册打开用的，咱也不知道为什么作者要分开两个项目，暂时不去修改 https://ext.dcloud.net.cn/plugin?id=6925-->
		<!-- <view class="get-out-canvas">
			<mumu-qrcode @callback='qrcodeCallback' ref='getQrcode'></mumu-qrcode>
		</view> -->
		<!-- 边框使用 style 实现，可以根据自己项目实际情况修改 -->
		<view class="footerSets rows space-between align-items-center">
			<view class="footer-large-buttons flex rows nowrap justify-content-end" style="margin-top: 10rpx;"
				id="bottom">
				<view class="footer-large-button text-center bg-add-card"
					style="border-bottom-left-radius:50rpx; border-top-left-radius:50rpx;" hover-class="tap" @click="cancel">
					<text class="text color-white footer-large-button-text">取消</text>
				</view>
				<view style="width: 1px;" />
				<view class="footer-large-button text-center bg-buy"
					style="border-bottom-right-radius:50rpx; border-top-right-radius:50rpx;" hover-class="tap"
					@click="SelectQrCodeFromAlbum">
					<text class="text color-white footer-large-button-text">相册选择</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	components: {
	},
	data() {
		return {
			jumppage:'',
		};
	},
	onLoad: function (options) {
		console.log("options",options)
		if(!options.type){
			uni.showToast({
			title: "缺少必要参数",
			icon:"error",
			duration: 2000,
			success: function (res) {},
		});
		return
		}
		this.jumppage = options.type
	},
	mounted() {

	},
	methods: {
		qrcodeSucess(data) {
			uni.showModal({
				title: '成功',
				content: data,
				success: () => {
					uni.navigateBack({})
				}
			})
		},
		qrcodeError(err) {
			console.log(err)
			uni.showModal({
				title: '摄像头授权失败',
				content: '摄像头授权失败，请检测当前浏览器是否有摄像头权限。',
				success: () => {
					uni.navigateBack({})
				}
			})
		},
		cancel: function () {
			this.KingonUI.Core.openNavigateBack();
		},
		SelectQrCodeFromAlbum: function () {
			this.$refs.getQrcode.getQrcode()
		},
		qrcodeCallback({ success, data }) {
			console.log("qrcodeCab", { success, data });
			if (!success) {
				uni.showToast({
					title: '识别失败',
					icon: 'error',
				});
			} else {
				// attendance跳转到考勤页面     visitorRegistration跳转到保安端的来访登记页面 
				if(['attendance'].includes(this.jumppage)){
					this.$eventHub.$emit('qrcodeCallback', { success, data });
				}else if(['visitorRegistration'].includes(this.jumppage)){
					this.$eventHub.$emit('qrcodeVisitorRegistration', { success, data });
				}
				uni.navigateBack();
			}
		},
	}
};
</script>

<style lang="scss" scoped>
.footerSets {
	z-index: 100;
	// background: linear-gradient(to bottom, #F8F8F8, #F8F8F8);
	// background: rgba(0, 0, 0, 0.557);
	position: fixed;
	bottom: 0;
	width: 100%;

	.footer-large-buttons {
		display: flex;
		flex-direction: row;
		padding: 10px;

		.footer-large-button {
			padding: 10px;
			flex: 1;
			background: rgba(0, 0, 0, 0.683);
			color: white
		}
	}
}

.get-out-canvas {
	position: fixed;
	top: 150vh;
}
</style>
